<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <style>
        body a{text-decoration:none;color: #ffffff;}
        .box{width:400px;height:800px;margin:0 auto;}
        .yzm{width:200px;height:40px;background:#8B8B8B;line-height: 40px;text-align:center;}
        .da{height:2000px;}
        .shang{border:1px solid #dedede;width:40px;height:100px;position: fixed;bottom: 40px;right:20px;display: none;}
        .erweima{height:50%}
        .jiant{line-height: 50px;text-align:center;color:#96b97d}
        .li{display: none;border:1px solid #00b9df;width:150px;height:150px;position:absolute;right:40px;}
        .dianming{width:500px;height:300px;margin:0 auto;}
        .qi{color:#ff6666;font-size:30px;}
    </style>
    <script type="text/javascript" src="{{asset('Home/build/layui.js')}}"></script>
</head>
<body>
    <hr>
    <div class="box">
        <a href="javascript:fasong()" id="fa">
            <div class="yzm">点击发送验证码</div>
        </a>
    </div>
    <div class="dianming">
        <div>
            <span class="qi">张三</span>
        </div>
        <button onclick="justdo(1)">开始</button>
    </div>
    <form enctype="multipart/form-data">
        <input type="file" name="img" class="layui-upload-file">
        <input type="submit" value="提交">
    </form>
    <div class="da"></div>

    <div class="shang">
        <div class="li"></div>
        <div class="erweima ma" style="border-bottom: 1px solid #dedede"></div>
        <a href="javascript:;" onclick="gotop()">
            <div class="erweima jiant">^</div>
        </a>
    </div>
    <img src="{{ url('/home/text/1') }}" onclick="this.src='{{ url('/home/text/1') }}?'+Math.random()">
    <span>{{ storage_path('app/upload') }}</span>
    <img src="{{ storage_path('app/upload') }}/20170623024307-594c803bb320a.jpg" alt="">
    <img src="{{ url('storage/app/upload/20170623024307-594c803bb320a.jpg') }}" alt="">
</body>
</html>
<script>
    layui.use(['layer','upload'],function(){
        $ = layui.jquery;
        layui.upload({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
            },
            url:'/upload',
            type:'post',
            success:function(data){
                console.log(data);
                if(data.code){

                }else{
                    layer.msg(data.info,{'icon':2});
                }
            }
        })
        window.onscroll = function(){
           if(document.body.scrollTop > 0){
               $('.shang').show(100);
           }else{
               $('.shang').hide();
           }
        }
        $('.ma').click(function(){
            var html = "<form>姓名：<input type='text'><br>年龄：<input type='text'><br><button>提交</button></form>";
            layer.open({
                'title':'意见反馈',
                content:html
            });
        })
        $('.ma').mouseout(function(){
            $('.li').hide();
        })
    });

    var time= 60;
    function fasong(){
        if(time == 0){
            text= '点击发送验证码';
            $('.yzm').text(text);
            $('#fa').attr('onclick','fasong()');
            time = 60;
            layer.alert('是金子总会发光的！',{'icon':1});
        }else{
            $('#fa').attr('href','javascript:;');
            var text = '已发送，'+time+'秒后再次发送';
            $('.yzm').text(text);
            time --;
            setTimeout(fasong,100)
        }
    }
    function gotop(){
        $('html,body').animate({'scrollTop':0},300)
    }
    function justdo(id){
        if(id == 1){
            $.get('./textname',function(data){
//            console.log(data);
                aname = data.name;
                //console.log(aname);
                set = setInterval(xuan,10);
            });
            $('button').attr('onclick','justdo(2)').text('停止');
        }else{
            clearInterval(set);
            $('.qi').text('素素');
            layer.alert('恭喜素素获得了吃屎的权利',{'icon':1});
            $('button').attr('onclick','justdo(1)').text('开始');
        }

    }
    function xuan(){
        var suiji = Math.ceil(Math.random()*10)-1;
        $('.qi').text(aname[suiji]);
    }

</script>